<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			.dv{
				width: 300px;
				height: 300px;
				background: #f00;
			}
			.bgcolor{
				background: #00f;
			}
		</style>
	</head>
	<body>
		<div class="dv" id="d1"></div>
		<input type="button" value="切换" id="btn"/>
		<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
		<script type="text/javascript">
			$("#btn").click(function () {
				$("#d1").toggleClass("bgcolor");
				/*var d1=$("#d1");
				if(d1.hasClass("bgred")){
					d1.removeClass("bgred");
					d1.addClass("bgblue");
				}
				else{
					d1.removeClass("bgblue");
					d1.addClass("bgred");
				}*/
			});
		</script>
		<p>段落1</p>
		<p>段落2</p>
		<p>段落3</p>
		<div id="d2">div</div>
		<p>段落4</p>
		<p>段落5</p>
		<p>段落6</p>
		<script type="text/javascript">
			//$("#d2+p")
			//$("#d2~p")
			//$("#d2").siblings("p").css("color","red");
			$("#d2").next().css("color","red");
			$("#d2").prev().css("color","blue");
			$("#d2").siblings().css("background","#ccc")
		</script>
	</body>
</html>
